<template>
  <div class="container">
    <div class="sub-company-detail">
        <div class="body">
            <h4>基本信息</h4>
            <i-cell-group class="panel-box">
                <i-input v-model="companyInfo.F_FullName" title="法定全称：" disabled />
                <i-input v-model="companyInfo.F_ShortName" title="简称：" disabled />
                <i-input v-model="companyInfo.F_ManagerId" title="主管：" disabled />
            </i-cell-group>
            <h4>子公司信息</h4>
            <i-swipeout  i-class="i-swipeout-item" operateWidth="120" v-for="(item, index) in companyInfo.childs" :key="index">
                <view slot="content">
                    {{item.F_FullName}}
                </view>
                <view slot="button" class="i-swipeout-button-group">
                    <view class="i-swipeout-button edit" @click="toEdit(item)">编辑</view>
                    <view class="i-swipeout-button delete" @click="toDetele(item.F_Id)">删除</view>
                </view>
            </i-swipeout>
        </div>
        <div class="buttom-btn">
            <div class="button" @click="toEdit(companyInfo)">编辑下级公司</div>
            <div class="button" @click="accountSetting">账号设置</div>
        </div>
    </div>
  </div>
</template>

<script>
import buttomBtn from '@/components/Bbutton'
import { sublist } from 'api/api'
export default {
    data () {
        return {
            companyInfo: {
                F_Id: '',
                F_FullName: '',
                F_ShortName: '',
                F_ManagerId: '',
                childs: []
            }
        }
    },

    components: {
        buttomBtn
    },

    methods: {
        toEdit (item) {
            console.log(item)
            const url = `../center/editorSubCompany?editInfo=${JSON.stringify(item)}`
            wx.navigateTo({ url })
        },
        handleClick () {
            wx.navigateTo({
                url: '/pages/center/addDepartment'
            })
        },
        accountSetting () {
            wx.navigateTo({
                url: '/pages/center/accountList'
            })
        },
        toDetele (id) {
            wx.showToast({
                title: '删除操作',
                icon: 'none',
                mask: true
            })
        },
        _sublist () {
            sublist(this.companyInfo.F_Id)
                .then(res => {
                    console.log(res)
                    this.companyInfo.childs = res.data
                })
        }
    },
    async onShow () {
        console.log(JSON.parse(this.$mp.query.orgDetail))
        this.companyInfo = JSON.parse(this.$mp.query.orgDetail)
        console.log(this.companyInfo)
        if (!this.companyInfo.childs) {
            await this._sublist()
        }
    }
}
</script>

<style lang='stylus' scoped>
.sub-company-detail
    width 750rpx
    display flex
    min-height 100vh
    flex-direction column
    justify-content space-between
    h4
        height 80rpx
        line-height 80rpx
        margin-left 50rpx
    .i-swipeout-item
        .i-swipeout-button-group
            display flex
            height 100%
            .i-swipeout-button
                flex 1
                align-items center
                text-align center
                line-height 50px
                color: #fff
                &.edit
                    background #ff9300
                &.delete
                    background  #ff0000
    .buttom-btn
        box-sizing: border-box
        display flex
        width: 100%
        height: 92rpx
        line-height 92rpx
        margin-top 80rpx
        .button
            display inline-block
            background: #007aff
            font-size 36rpx
            color #ffffff
            height 100%
            flex 1
            text-align center
            &:first-child
                border-right 1rpx solid #fff
</style>
